﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>接口登陆</title>
    <style>
        body {
            background-color: #f3f3f3; /* 设置页面背景颜色 */
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            margin-top: -50px;
        }

        .login-container {
            width: 300px;
            padding: 20px;
            background-color: #ffffff; /* 设置登录框背景颜色 */
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }

            .login-container h2 {
                text-align: center;
                color: black;
            }

        .form-group {
            margin-bottom: 10px;
        }

            .form-group label {
                display: block;
                margin-bottom: 5px;
                font-weight: bold;
            }

            .form-group input {
                width: 100%;
                height: 20px;
                padding: 5px;
                border: 1px solid #ccc;
                border-radius: 3px;
            }

            .form-group button {
                width: 100%;
                padding: 8px;
                background-color: #4CAF50; /* 设置按钮颜色 */
                color: #ffffff;
                border: none;
                border-radius: 3px;
                cursor: pointer;
            }
    </style>
    <script>
        window._$ = (function () {
            // 版本号
            let version = '1.0';
            var n = {};

            n.getParam = function (key) {
                let url = location.href.split("?")[1];
                const urlSearchParams = new URLSearchParams(url);
                const params = Object.fromEntries(urlSearchParams.entries());
                var paramValue = params[key];
                if (paramValue == "undefined" || paramValue == null) {
                    paramValue = "";
                }
                return paramValue;
            }

            n.postJson = function ({ url, data, timeout }) {
                return new Promise((resolve, reject) => {
                    const xhr = new XMLHttpRequest();
                    xhr.open('POST', url);
                    if (timeout) {
                        // 设置超时时间
                        xhr.timeout = timeout;
                    }
                    xhr.onload = function () {
                        if (this.status >= 200 && this.status < 300) {
                            resolve(JSON.parse(this.responseText), this);
                        } else {
                            reject({ code: this.status, msg: '请求错误', response: this.response }, this);
                        }
                    };
                    xhr.onerror = function () {
                        reject({ code: this.status, msg: '网络错误', response: this.response }, this);
                    };
                    xhr.ontimeout = function () {
                        reject({ code: this.status, msg: '请求超时', response: this.response }, this);
                    };
                    xhr.setRequestHeader('Content-Type', 'application/json');
                    xhr.setRequestHeader('Content-Length', JSON.stringify(data).length);
                    xhr.send(JSON.stringify(data));
                });
            }
            return {
                version: version,
                ...n
            };
        })();
        function login() {
            var username = document.getElementById("username").value;
            var password = document.getElementById("password").value;
            _$.postJson({ url: "api/login/swaggerLogin", data: { username, password } }).then(res => {
                if (res.code == 200) {
                    window.location.href = location.origin + _$.getParam("returnUrl") + "?ticket=" + res.data.ticket
                } else {
                    alert("登陆失败")
                }
            })
        }
        document.addEventListener('keydown', function (event) {
            if (event.key === 'Enter') {
                event.preventDefault();
                login();
            }
        });
    </script>
</head>
<body>
    <div class="login-container" style="display:none" id="myDiv">
        <h2>API接口登陆</h2>
        <form>
            <div class="form-group">
                <label for="username">账号:</label>
                <input type="text" id="username" name="username" placeholder="Enter your username" value="">
            </div>
            <div class="form-group">
                <label for="password">密码:</label>
                <input type="password" id="password" name="password" placeholder="Enter your password" value="">
            </div>
            <div class="form-group">
                <button type="button" onclick="login()">Login</button>
            </div>
        </form>
    </div>
</body>
</html>
<script>
    var div = document.getElementById("myDiv");
    var clickCount = 0;
    var timer;
    document.addEventListener("click", function () {
        clearTimeout(timer); // 清除计时器
        clickCount++;
        if (clickCount === 8) {
            div.style.display = "block";
            clickCount = 0; // 重置点击次数
        } else {
            timer = setTimeout(function () {
                clickCount = 0; // 如果间隔时间太长则重置点击次数
            }, 1000); // 设置一个1秒的计时器
        }
    });
</script>